<!DOCTYPE html>
<html>

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.bundle.min.js"></script> </head>

<body>
    <div class="media">
        <img class="align-self-center mr-3" src="./media2.jpg" alt="Generic placeholder image">
        <div class="media-body">
            <h5 class="mt-0">Center-aligned media</h5>
            <p>Cras sit amet nibh libero, in gravida nulla. Nulla
                vel metus scelerisque ante sollicitudin. Cras
                purus odio, vestibulum in vulputate at, tempus
                viverra turpis. Fusce condimentum nunc ac nisi
                vulputate fringilla. Donec lacinia congue felis
                in faucibus.</p>
            <p class="mb-0">Donec sed odio dui. Nullam quis risus eget urna mollis
                ornare vel eu leo. Cum sociis natoque penatibus
                et magnis dis parturient montes, nascetur ridiculus
                mus.</p>
        </div>
    </div>
</body>

</html>